import { _decorator, Component, Node, Vec3, v3, tween, SpriteFrame, Camera, Sprite } from 'cc';
import { GlobalConfig } from '../../Init/Config/GlobalConfig';
import GlobalData from '../../Init/Config/GlobalData';
import { GlobalEnum } from '../../Init/Config/GlobalEnum';
import EventManager from '../../Init/Managers/EventManager';
import { EventTypes } from '../../Init/Managers/EventTypes';
import GlobalPool from '../../Init/Tools/GlobalPool';
import Loader from '../../Init/Tools/Loader';
const { ccclass, property } = _decorator;

@ccclass('EmojiLayer')
export class EmojiLayer extends Component {
    isLoadFinish = false;
    imgRecs: { [name: string]: SpriteFrame } = {};
    emojiRecs: { [uuid: string]: EmojiRec } = {};
    cameraUI: Camera = null;

    onLoad() {
        EventManager.on(EventTypes.EffectEvents.ShowEmoji, this.onShowEmoji, this);
        this.cameraUI = GlobalData.get(GlobalEnum.GlobalDataType.Camera3D);
        this.loadImgs();
    }
    onEnable() {
        this.reset();
    }

    reset() {
        GlobalPool.putAllChildren(this.node);
        this.emojiRecs = {};
    }

    _tmpPos = v3();
    update(dt: number) {
        for (const key in this.emojiRecs) {
            const rec = this.emojiRecs[key];
            if (rec && !rec.isFinish) {
                rec.update()
            } else {
                GlobalPool.put(rec.node);
                delete this.emojiRecs[key];
            }
        }
    }

    loadImgs() {
        Loader.loadBundleDir('UI', 'Assets/load', (arr: SpriteFrame[]) => {
            for (let i = 0; i < arr.length; i++) {
                const e = arr[i];
                this.imgRecs[e.name] = e;
            }
            this.isLoadFinish = true;
        }, SpriteFrame, false)
    }

    onShowEmoji(d: { t: GlobalEnum.EmojiTypes, target: Node }) {
        if (!this.isLoadFinish) return;
        let node = GlobalPool.get('emojiPop');
        node.parent = this.node;
        let sp = node.getComponentInChildren(Sprite);
        sp.spriteFrame = this.imgRecs[d.t];
        let rec = new EmojiRec(d.target, node, this.cameraUI);
        this.emojiRecs[node.uuid] = rec;
    }

}

export class EmojiRec {
    target: Node;
    node: Node;
    targetPos: Vec3 = v3();
    scale: Vec3 = v3();
    isFinish = false;
    cameraUI: Camera = null;

    constructor(t: Node, n: Node, cameraUI: Camera) {
        this.cameraUI = cameraUI;
        this.target = t;
        this.targetPos.set(t.position);
        this.node = n;
        this.scale.set(0);
        this.node.setScale(this.scale);
        this.isFinish = false;
        this.showScaleAnim();
        this.calPos();
    }

    showScaleAnim() {
        tween(this.scale).
            to(0.5, { x: 1, y: 1, z: 1 }, { easing: 'backOut' }).
            delay(2).
            to(0.5, { x: 0, y: 0, z: 0 }, { easing: 'backIn' }).
            call(() => {
                this.isFinish = true;
            }).start();
    }

    update(dt?) {
        this.calPos();
        this.node.setScale(this.scale);
    }
    _tmpPos = v3();
    calPos() {
        if (!this.node.parent) return;
        if (this.target) {
            this._tmpPos.set(this.target.position);
            //转3d坐标
            this.targetPos.x = this._tmpPos.x * GlobalConfig.Scale2DTo3D;
            this.targetPos.y = 2.5;
            this.targetPos.z = -this._tmpPos.y * GlobalConfig.Scale2DTo3D;
        }
        //计算坐标
        this.cameraUI.convertToUINode(this.targetPos, this.node.parent, this._tmpPos);
        this.node.setPosition(this._tmpPos);
    }

}